import React, { Children } from 'react'
import styles from './index.module.scss'
import { LeftOutline } from 'antd-mobile-icons'
import {useNavigate} from 'react-router-dom'

export default function NavBar({children,extra}){
    let navigator = useNavigate()
    const back = ()=>{
        navigator(-1)
    }
    return (
    <div>
        <div className= {styles.root}>
            {/* 左侧 */}
            <div className='left'><LeftOutline onClick={back}/></div>
            {/* 居中 */}
            <div className='title'>{children}</div>
            {/* 右侧 */}
            <div className='right'>{extra}</div>
        </div>
    </div>)
}